<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>视频播放</title>
		<link rel="stylesheet" type="text/css" href="./css/video.css" />
		<style type="text/css">
			.cur{
				border-bottom:2px solid rgb(255, 205, 0);
			}
			.cur1{
				display:none;
			}
		</style>
	</head>
	<body>
		<div class="body">
			<div class="container">
				<div class="left">
					<div class="title">
						<div id="">
							<span id="back">返回</span>
						</div>
						<!-- <span>1</span> -->
					</div>
					<div class="video">
						<video id="video"></video>
						<canvas id="cvs" width="900" height="360"></canvas>
					</div>
					<div class="left_container">
						<div class="h">
							<span id="lspan" class="left">00:00</span>
							<input id="range" type="range" min="0" value="0" max="100" />
							<span id="rspan" class="right">00:00</span>
						</div>
						<div class="button">
							<button id="btn_play"><img src="./img/xiangqing/播放暂停.png"></button>
							<button id="btn_vp"><img src="./img/xiangqing/音量加大.png"></button>
							<button id="btn_vm"><img src="./img/xiangqing/音量减小.png"></button>
							<button id="btn_05"><img src="./img/xiangqing/bofangye_beisubofang_2.png"></button>
							<button id="btn_1"><img src="./img/xiangqing/bofangye_beisubofang_1.png"></button>
							<button id="btn_2"><img src="./img/xiangqing/bofangye_beisubofang.png"></button>
						</div>
						<div id="danmu">
							<input type="text" id="msg" placeholder="请输入弹幕">
							<button id="send">发送弹幕</button>
							<div id="">请选择弹幕颜色
								<select id="color">
									<option value ="1">black</option>
									<option value ="2">white</option>
									<option value ="3">yellow</option>
									<option value ="4">blue</option>
									<option value ="5">orange</option>
									<option value ="6">red</option>
								</select>
							</div>
						</div>
					</div>
				</div>
				<div class="right">
					<div class="right_top"></div>
					<div class="right_bottom">
						<div class="right_bottom_top">
							<span class="cur" data-index='1'>课程介绍</span>
							<span data-index='2'>在线提问</span>
						</div>
						<div class="cur1">
							<div >
								<div class="chatbox">
									<div id="chat">
<!-- 										<div>
										<label>${item.name}:</label>
										<span>${item.content}</span>
										</div> -->
									</div>
								</div>
								<div class="shuru_fasong">
									<input type="text" id="input"/>
									<button type="button" id="fasong">发送</button>
								</div>
							</div>
						</div>
						<div class="course_brief">
							
						</div>
					</div>
				</div>
			</div>
		</div>

		<script src="js/jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script>
		<script>

		</script>
		<script src="./js/moment.js"></script>
		<script src="js/video.js"></script>	
	</body>
</html>
